{{#accordion-list showExpandAll=false as | al expandFn |}}
  <div class="over-hr">
    <span>
      {{driverContentTitle}}
    </span>
  </div>

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.access.title")
     detail=(t "nodeDriver.vmwarevsphere.access.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}

    {{form-auth-cloud-credential
      driverName=driverName
      parseAndCollectErrors=(action "errorHandler")
      primaryResource=model
      cloudCredentials=cloudCredentials
      finishAndSelectCloudCredential=(action "finishAndSelectCloudCredential")
      progressStep=(action "finishAndSelectCloudCredential")
      cancel=(action "cancel")
      hideSave=true
    }}

  {{/accordion-list-item}}

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.scheduling.title")
     detail=(t "nodeDriver.vmwarevsphere.scheduling.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}
    <div class="row">
      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.dataCenter.label"}}
        </label>
        <NewSelect 
          @class="form-control"
          @useContentForDefaultValue={{true}}
          @content={{datacenterContent}}
          @value={{config.datacenter}}
          @optionValuePath="value"
          @optionLabelPath="label"
        />
        <p class="help-block">
          {{t "nodeDriver.vmwarevsphere.dataCenter.help"}}
        </p>
        <SelectValueCheck @values={{config.datacenter}} @options={{datacenterContent}} />
      </div>

      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.pool.label"}}
        </label>
        <NewSelect 
          @class="form-control"
          @useContentForDefaultValue={{true}}
          @content={{resourcePoolContent}}
          @value={{config.pool}}
        />
        <p class="help-block">
          {{t "nodeDriver.vmwarevsphere.pool.help"}}
        </p>
        <SelectValueCheck @values={{config.pool}} @options={{resourcePoolContent}} />
      </div>
    </div>

    <div class="row">
      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.dataStore.label"}}
          <TooltipElement
            @type="tooltip-basic"
            @tooltipTemplate="tooltip-static"
            @model={{t "nodeDriver.vmwarevsphere.dataStore.cluster.tooltip"}}
            @inlineBlock={{true}}
          >
            <BtnToggle
              @toggled={{action "toggleUseDataStoreCluster"}}
              @checked={{mut config.useDataStoreCluster}}
            />
          </TooltipElement>
        </label>
        {{#if config.useDataStoreCluster}}
          <NewSelect 
            @class="form-control"
            @useContentForDefaultValue={{true}}
            @content={{dataStoreClusterContent}}
            @value={{config.datastoreCluster}}
          />
          <p class="help-block">
            {{t "nodeDriver.vmwarevsphere.dataStore.cluster.help"}}
          </p>
          <SelectValueCheck @values={{config.datastoreCluster}} @options={{dataStoreClusterContent}} />
        {{else}}
          <NewSelect 
            @class="form-control"
            @useContentForDefaultValue={{true}}
            @content={{dataStoreContent}}
            @value={{config.datastore}}
          />
          <p class="help-block">
            {{t "nodeDriver.vmwarevsphere.dataStore.help"}}
          </p>
          <SelectValueCheck @values={{config.datastore}} @options={{dataStoreContent}} />
        {{/if}}
      </div>
      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.folder.label"}}
        </label>
        <NewSelect 
          @class="form-control"
          @useContentForDefaultValue={{true}}
          @content={{folderContent}}
          @value={{config.folder}}
        />
        <p class="help-block">
          {{t "nodeDriver.vmwarevsphere.folder.help"}}
        </p>
        <SelectValueCheck @values={{config.folder}} @options={{folderContent}} />
      </div>
    </div>

    <div class="row">
      <div class="col span-12">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.host.label"}}
        </label>
        <NewSelect 
          @class="form-control"
          @useContentForDefaultValue={{true}}
          @content={{hostContent}}
          @value={{config.hostsystem}}
        />
        <p class="help-block">
          {{t "nodeDriver.vmwarevsphere.host.help"}}
        </p>
        <SelectValueCheck @values={{config.hostsystem}} @options={{hostContent}} />
      </div>
    </div>
  {{/accordion-list-item}}

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.instance.title")
     detail=(t "nodeDriver.vmwarevsphere.instance.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}
    <div class="row">
      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.cpuCount.label"}}
        </label>
        <div class="input-group">
          {{input-integer
            min=1
            max=32
            value=config.cpuCount
            classNames="form-control"
          }}
          <div class="input-group-addon bg-default">
            {{t "nodeDriver.vmwarevsphere.cpuCount.unit" cores=config.cpuCount}}
          </div>
        </div>
      </div>

      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.memorySize.label"}}
        </label>
        <div class="input-group">
          {{input-integer
            min=1
            value=config.memorySize
            classNames="form-control"
          }}
          <div class="input-group-addon bg-default">
            {{t "nodeDriver.vmwarevsphere.memorySize.unit"}}
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col span-6">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.diskSize.label"}}
        </label>
        <div class="input-group">
          {{input-integer
            min=1
            value=config.diskSize
            classNames="form-control"
          }}
          <div class="input-group-addon bg-default">
            {{t "nodeDriver.vmwarevsphere.diskSize.unit"}}
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col {{if showContentLibrary "span-4" "span-6"}}">
        <label class="acc-label">
          {{t "nodeDriver.vmwarevsphere.creationType.label"}}
        </label>
        <NewSelect
            @class="form-control"
            @useContentForDefaultValue={{true}}
            @content={{creationTypeContent}}
            @value={{config.creationType}}
        />
      </div>

      {{#if showRancherOsIso }}
          <div class="col span-6">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.boot2dockerUrl.label"}}
            </label>
            {{input
              type="text"
              value=config.boot2dockerUrl 
              classNames="form-control"
              placeholder=(t "nodeDriver.vmwarevsphere.boot2dockerUrl.placeholder")
            }}
          </div>
      {{/if}}
      {{#if showContentLibrary}}
          <div class="col span-4">
              <label class="acc-label">
                {{t "nodeDriver.vmwarevsphere.contentLibrary"}}
              </label>
              <NewSelect
                @useContentForDefaultValue={{true}}
                @content={{contentLibraryContent}}
                @value={{config.contentLibrary}}
              />
          </div>
          <div class="col span-4">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.libraryTemplate"}}
            </label>
            <SearchableSelect
              @content={{libraryTemplateContent}}
              @value={{config.cloneFrom}}
            />
          </div>
      {{/if}}
      {{#if showVirtualMachine}}
            <div class="col span-6">
              <label class="acc-label">
                {{t "nodeDriver.vmwarevsphere.virtualMachine"}}
              </label>
              <SearchableSelect
                @content={{virtualMachineContent}}
                @value={{config.cloneFrom}}
              />
            </div>
      {{/if}}
      {{#if showTemplate}}
          <div class="col span-6">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.template"}}
            </label>
            <SearchableSelect
              @content={{templateContent}}
              @value={{config.cloneFrom}}
            />
          </div>
      {{/if}}
    </div>

    <div class="row">
      <div class="col span-12">
        {{#if showRancherOsIso }}
          <label class="acc-label">
            {{t "nodeDriver.vmwarevsphere.cloudinit.label"}}
          </label>
          {{input
            type="text"
            value=config.cloudinit 
            classNames="form-control"
            placeholder=(t "nodeDriver.vmwarevsphere.cloudinit.placeholder")
          }}
          <p class="help-block">
            {{t "nodeDriver.vmwarevsphere.cloudinit.help"}}
          </p>
        {{else}}
          <label class="acc-label">
            {{t "nodeDriver.vmwarevsphere.cloudconfig.label"}}
          </label>
          {{input-yaml
            showDownload=false
            showUpload=false
            canChangeName=false
            gutters=(array)
            minHeight=500
            value=config.cloudConfig
            valueUpdated=(action "updateCloudConfig")
          }}
        {{/if}}
      </div>
    </div>

    <div class="row">
      <div class="col span-12">
        <FormContextualSelectArray
          @editing={{true}}
          @content={{networkContent}}
          @contentFilter={{action "networkContentFilter"}}
          @values={{config.network}}
          @addActionLabel="nodeDriver.vmwarevsphere.network.addActionLabel"
          @valueLabel="nodeDriver.vmwarevsphere.network.valueLabel"
          @valuePlaceholder="nodeDriver.vmwarevsphere.network.valuePlaceholder"
        />
        <SelectValueCheck @values={{config.network}} @options={{networkContent}} />
      </div>
    </div>

    <div class="row">
      <div class="col span-12">
        {{form-key-value
          allowEmptyValue=false
          initialArray=initParamArray
          changedArray=(action "paramChanged")
          header=(t "nodeDriver.vmwarevsphere.cfgparam.label")
          valuePlaceholder="nodeDriver.vmwarevsphere.cfgparam.value.placeholder"
          keyPlaceholder="nodeDriver.vmwarevsphere.cfgparam.key.placeholder"
          addActionLabel="nodeDriver.vmwarevsphere.cfgparam.addActionLabel"
        }}
      </div>
    </div>
  {{/accordion-list-item}}

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.tags.title")
     detail=(t "nodeDriver.vmwarevsphere.tags.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}
    <FormContextualSelectArray
      @editing={{true}}
      @content={{tagContent}}
      @contentFilter={{action "tagContentFilter"}}
      @values={{config.tag}}
      @addActionLabel="nodeDriver.vmwarevsphere.tags.addActionLabel"
      @valuePlaceholder="nodeDriver.vmwarevsphere.tags.valuePlaceholder"
    />
  {{/accordion-list-item}}

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.customAttributes.title")
     detail=(t "nodeDriver.vmwarevsphere.customAttributes.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}
    <FormContextualKeyValue
      @keyContent={{customAttributeKeyContent}}
      @keyContentFilter={{action "customAttributeKeyContentFilter"}}
      @keyValuePairs={{customAttribute}}
      @addActionLabel="nodeDriver.vmwarevsphere.customAttributes.addActionLabel"
    />
  {{/accordion-list-item}}

  {{#accordion-list-item
     title=(t "nodeDriver.vmwarevsphere.vappOptions.title")
     detail=(t "nodeDriver.vmwarevsphere.vappOptions.detail")
     expandAll=expandAll
     expand=(action expandFn)
     expandOnInit=true
  }}
    <p class="help-block">{{t "nodeDriver.vmwarevsphere.vappHelp"}}</p>
    <div class="row">
      <div class="col span-12">
        <div class="radio">
          <label>
            {{radio-button
              selection=vappMode
              value="disabled"
            }} {{t "nodeDriver.vmwarevsphere.vappMode.disabled"}}
          </label>
        </div>
        <div class="radio">
          <label>
            {{radio-button
              selection=vappMode
              value="auto"
            }} {{t "nodeDriver.vmwarevsphere.vappMode.auto"}}
          </label>
        </div>
        <div class="radio">
          <label>
            {{radio-button
              selection=vappMode
              value="manual"
            }} {{t "nodeDriver.vmwarevsphere.vappMode.manual"}}
          </label>
        </div>
      </div>
    </div>
    {{#if (eq vappMode "manual")}}
      <div>
        <div class="row">
          <div class="col span-4">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.vappTransport.label"}}
            </label>
            {{input
              type="text"
              value=config.vappTransport
              classNames="form-control"
              placeholder=(t "nodeDriver.vmwarevsphere.vappTransport.placeholder")
            }}
            <p class="help-block">
              {{t "nodeDriver.vmwarevsphere.vappTransport.help"}}
            </p>
          </div>
          <div class="col span-4">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.vappIpprotocol.label"}}
            </label>
            {{input
              type="text"
              value=config.vappIpprotocol
              classNames="form-control"
              placeholder=(t "nodeDriver.vmwarevsphere.vappIpprotocol.placeholder")
            }}
            <p class="help-block">
              {{t "nodeDriver.vmwarevsphere.vappIpprotocol.help"}}
            </p>
          </div>
          <div class="col span-4">
            <label class="acc-label">
              {{t "nodeDriver.vmwarevsphere.vappIpallocationpolicy.label"}}
            </label>
            {{input
              type="text"
              value=config.vappIpallocationpolicy
              classNames="form-control"
              placeholder=(t "nodeDriver.vmwarevsphere.vappIpallocationpolicy.placeholder")
            }}
            <p class="help-block">
              {{t "nodeDriver.vmwarevsphere.vappIpallocationpolicy.help"}}
            </p>
          </div>
        </div>

        <div class="row">
          <div class="col span-12">
            {{form-key-value
              allowEmptyValue=false
              initialArray=initVappArray
              changedArray=(action "vappPropertyChanged")
              header=(t "nodeDriver.vmwarevsphere.vappProperty.label")
              valuePlaceholder="nodeDriver.vmwarevsphere.vappProperty.value.placeholder"
              keyPlaceholder="nodeDriver.vmwarevsphere.vappProperty.key.placeholder"
              addActionLabel="nodeDriver.vmwarevsphere.vappProperty.addActionLabel"
            }}
          </div>
        </div>
      </div>
    {{/if}}
  {{/accordion-list-item}}

  <div class="over-hr">
    <span>
      {{templateOptionsTitle}}
    </span>
  </div>

  {{form-name-description
    model=model
    nameRequired=true
    rowClass="row mb-10"
  }}

  {{form-user-labels
    initialLabels=labelResource.labels
    setLabels=(action "setLabels")
    expand=(action expandFn)
  }}

  {{form-node-taints
    model=model
    expand=(action expandFn)
  }}

  {{form-engine-opts
    machine=model
    showEngineUrl=showEngineUrl
  }}

  {{top-errors errors=errors}}
  {{save-cancel
    save=(action "save")
    cancel=(action "cancel")
    editing=editing
  }}
{{/accordion-list}}
